import React from 'react'
import { TextField, FormLabel, ListItem, Select, Button, FormControl } from '@material-ui/core'
import { Search, Loop } from '@material-ui/icons';
import { makeStyles } from '@material-ui/core/styles';
import PubSub from 'pubsub-js'
import SiAnniu from './SiAnniu'
import Shuju from './Shuju'


const useStyles = makeStyles((theme) => ({
    btnSearch: {
        marginLeft: '15px',
        marginRight: '15px',
        minWidth: '60px'
    },
    btnReset: {
        minWidth: '80px',
    }
}));
export default function Post() {
    const classes = useStyles();
    //获取数据
    let[data,setData]=React.useState({words:{postCode:'',postName:'',status:''}})
   const getVlaue=(key,e)=>{
    let d=data.words
    for (let index in data.words) {
        if (index===key) {
            d[index]=e.target.value
           setData({words:d})
        }
        
    }    
   }
    let find=()=>{
       PubSub.publish('TiaoJian', {postCode:data.words.postCode,postName:data.words.postName,status:data.words.status  })
       PubSub.publish('ShuXin', 1)
    }
    //重置
    const chongzhianliu=()=>{
        
        document.getElementById("postCode").value='';
        document.getElementById("postName").value='';
        document.getElementById("status").value='';
        
    }
    const [xianshi,setxianshi] =React.useState(true);
    
    const token = PubSub.subscribe('xianshiyingchang', (_, stateObj) => {
        setxianshi(stateObj.xianshiyingchang)
    })
    return (
        <div>
            <div style={{ display: xianshi ? 'block' : 'none'}}>
            <ListItem>
                <FormLabel
                    style={{ color: 'black', marginRight: '15px', minWidth: '70px' }}
                >岗位编码</FormLabel>
                <TextField
                    style={{ minWidth: '200px' }}
                    variant='outlined'
                    placeholder='请输入岗位编码'
                    size='small'
                    id="postCode"
                    onKeyUp={getVlaue.bind(this,'postCode')}
                >
                </TextField>
                <FormLabel
                    style={{ color: 'black', marginLeft: '15px', marginRight: '15px', minWidth: '70px' }}
                >岗位名称</FormLabel>
                <TextField
                    style={{ minWidth: '200px' }}
                    variant='outlined'
                    placeholder='请输入岗位名称'
                    size='small'
                    id="postName"
                    onKeyUp={getVlaue.bind(this,'postName')}
                >
                </TextField>
                <FormLabel
                    style={{ color: 'black', marginLeft: '30px', marginRight: '15px', minWidth: '40px' }}
                >状态</FormLabel>
                <FormControl variant="outlined">
                    <Select
                        native
                        style={{ fontSize:'12px',height:'34px', minWidth: '200px' }}
                        id='status'
                        onChange={getVlaue.bind(this,'status')}
                    >
                        <option value="" style={{ display: 'none' }}>岗位状态</option>
                        <option value="0">正常</option>
                        <option value="1">停用</option>
                    </Select>
                </FormControl>
                <Button className={classes.btnSearch} variant="contained" color="primary" onClick={find}>
                    <Search />搜索
                </Button>
                <Button className={classes.btnReset} variant="outlined" color="primary" onClick={chongzhianliu}>
                    <Loop />重置
                </Button>
            </ListItem>
            
            </div>
            <SiAnniu />
            <br/>
            <br/>
            <br/>
            <br/>
            <Shuju />
        </div>
    )
}

















